<!DOCTYPE html>
<html>
  <head>
    <title>d01.html</title>

    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
   
	<script type="text/javascript" src="../js/jquery-1.11.1.js"></script>
	<script type="text/javascript">
	/*
		html() innerHTML
		text() innerText
	*/
		function f1(){
			//alert($('#d1').html());
			alert($('#d1').text());
		}
		
		function f2(){
			$('#d1').html('<p>hello dojo</p>');
		}
		
		/*val() value*/
		function f3(){
			//alert($(':text').val());
			$(':text').val('kitty');
		}
		
		function f4(){
			//alert($('#d1').attr('id'));
			$('#d1').attr('style','color:red;font-style:italic;');
		}
	</script>
  </head>
  
  <body>
  	<!-- DOM操作：查询 -->
  	<!-- 找到子节点之后，可以读取或者修改节点的HTML内容，文本内容，value属性值和属性值 -->
  	<div id="d1"><span>Hello Jquery</span></div>
  	username:<input name="username"/><br/>
  	<a href="javascript:;" onclick="f3();">DOM操作</a>
  </body>
</html>
